Row 1

Offence per 1,000 people (LSOA units)

Offence per 1,000 people (Ward units)

Row 2

Offence per 1,000 people (LSOA units)

% Change in offence level Statistics

Row 3

Offence per 1,000 people (LSOA units)

Offence per 1,000 people (Ward units)

Offence per 1,000 people (Ward units)

---
title: "**Offence:** Possession of Weapon"
output: 
  flexdashboard::flex_dashboard:
    self_contained: true
    orientation: rows
    source: embed
    social: menu
bibliography: ../references/references.bib
---


```{r setup, include=FALSE}
packages = c("dplyr", "rgdal", "knitr",
             "sf", "viridis", "ggeasy",
             "tidyr","scales",
             "etasFLP","maptools","sp",
             "raster","leaflet","htmlwidgets",
             "htmltools", "ggplot2",
             "flexdashboard", "tidyverse",
             "leaflet.minicharts", "manipulateWidget")

## Now load or install&load all
package.check <- lapply(
  packages,
  FUN = function(x) {
    if (!require(x, character.only = TRUE)) {
      install.packages(x, dependencies = TRUE)
      library(x, character.only = TRUE)
    }
  }
)


# Setup knitr
knitr::opts_chunk$set(
  echo = FALSE, message = FALSE, warning = FALSE,
  # Save all figures in the output dir, you have to include them explicitly
  # with an <img> tag
  fig.path = "../output/img/", fig.show = "show"
)
```



```{r, include=FALSE}
#generate all the necessary tables

#setting work directory
pasteo <- "R:/HLSS/Big Data Centre/Data/TRANSFER_FROM_SERVER_ROOM/20221014/GMP/AMO/"

#load all boundary shapefile

#load gm boundary
gm_bdry <- sf::read_sf(paste(pasteo, "boundaries/", "GMP_BOUNDARY_geo", ".shp", sep=""))

#load la boundary
gm_la <- sf::read_sf(paste(pasteo, "boundaries/", "GM_LA_geo", ".shp", sep=""))

#load wards boundary
gm_ward <- sf::read_sf(paste(pasteo, "boundaries/", "gm_ward_geo", ".shp", sep=""))

#load lsoa boundary
gm_lsoa <- sf::read_sf(paste(pasteo, "boundaries/", "GMP_LSOA_BOUNDARY_geo", ".shp", sep=""))

#load city centre boundary
gm_centre <- sf::read_sf(paste(pasteo, "boundaries/", "city_and_town_Centre_merged2", ".shp", sep=""))

```

```{r, include=FALSE}
library(crosstalk)
library(leaflet)
library(dplyr)
library(reactable)
library(kableExtra)
#library(formattable)

#SharedData$n

breweries91 <- leaflet::breweries91

# A SpatialPointsDataFrame for the map.
# Set a group name to share data points with the table.
brew_sp <- SharedData$new(breweries91, group = "id")

# A regular data frame (without coordinates) for the table.
# Use the same group name as the map data.
brew_data <- as_tibble(breweries91) %>%
  dplyr::select(brewery, address, village, founded) %>%
  data.frame()
  #SharedData$new(group = "id") #to do the joining

#head(brew_data)

map <- leaflet(brew_sp) %>%
  addTiles() %>%
  addMarkers()

##map

#
tbl <- reactable(
  brew_data[1:10,] %>% 
    dplyr::mutate(Name = substr(village, 1, 5)) %>%
    dplyr::mutate(founded2 = founded-1800)%>%
    dplyr::filter(!is.na(founded2))%>%
    dplyr::select(Name, founded2)%>%
    dplyr::mutate(founded2 = as.numeric(if_else(Name == "Adels", paste("0"), paste(founded2)))),
  #selection = "multiple",
  onClick = "select",
  # borderless = TRUE,
  # highlight = TRUE,
  # rowStyle = list(cursor = "pointer"),
  #defaultSelected = c(1:10),
  columns = list(
  founded2 = colDef(
      cell = function(value) {
       if (value > 0) {
        img_src <- image_uri(paste(getwd(), "img/up_arrow.jpg", sep="/"))
        image <- img(src = img_src, style = "height: 24px;", alt = value)
        tagList(
        div(style = "display: inline-block; width: 15px", image),
        paste0("+", value, "%")
        )} else if (value < 0) {
        img_src <- image_uri(paste(getwd(), "img/down_arrow.jpg", sep="/"))
        image <- img(src = img_src, style = "height: 24px;", alt = value)
        tagList(
        div(style = "display: inline-block; width: 25px", image), 
        paste0(value, "%")
    )} else 
        # img_src <- image_uri(paste(getwd(), "img/dash.jpg", sep="/"))
        # image3 <- img(src = img_src, style = "height: 15px;", alt = value)
        # tagList(
        # div(style = "display: inline-block; width: 20px", image3), 
        paste0(value, "%")
        #)
  },
    #align = "left",
      style = function(value) {
        color <- if (value > 0) {
          "#e00000"
        } else if (value < 0) {
          "#008000"
        } else "blue"
        list(fontWeight = 600, color = color)
      }
    )
  ),
 #rownames = TRUE,
  # pagination = FALSE,
  #searchable = TRUE,
  wrap = FALSE,
  striped = TRUE,
  highlight = TRUE,
  bordered = TRUE,
  theme = reactableTheme(
    borderColor = "#dfe2e5",
    stripedColor = "#f6f8fa",
    highlightColor = "#f0f5f9",
    cellPadding = "8px 12px",
    style = list(fontFamily = "-apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif"),
    searchInputStyle = list(width = "100%")
    ),
  minRows = 8
)
#

tbl

```

## Row 1 {data-height=80}

### Offence per 1,000 people (LSOA units) {data-width=1200}

```{r, include=TRUE}
# mm1 <- htmltools::browsable(
#   htmltools::tagList(map, tbl)
#   #htmltools::tagAppendChild(tag1, tbl)
# )
# mm1

```



### Offence per 1,000 people (Ward units)



## Row 2 {data-height=150}

### Offence per 1,000 people (LSOA units){data-width=200}

```{r eval=FALSE}

# #render map
# map3 <- leaflet() %>%
#   addTiles %>% 
#   addPolygons(data =   bckgrnd2, #
#               color="white",
#               #label = ~FILE_NAME,
#               labelOptions = labelOptions(
#                 noHide = T, textOnly = T,
#                 textsize = 22,
#                 style = list('color' = "white")
#               ),
#               ##color = ~colorQuantile("gray", gm_la$FILE_NAME)(FILE_NAME),
#               fillOpacity = 1,
#               group = "background")%>%
#  #addProviderTiles(providers$CartoDB.Positron) %>%
#   addPolygons(data = gm_la %>% filter(FILE_NAME == "ROCHDALE"), weight = 1,  #all la boundaries
#               color="black",
#               #label = ~FILE_NAME,
#               labelOptions = labelOptions(
#                 noHide = T, textOnly = T,
#                 textsize = 22,
#                 style = list('color' = "black")
#               ),
#               ##color = ~colorQuantile("gray", gm_la$FILE_NAME)(FILE_NAME),
#               fillOpacity = 0.1,
#               group = "la")
#   # addTiles %>% 
#   # setView(-2.271, 53.504, zoom = 1.5) %>% syncWith("maps")%>%
#   # addPolygons(data =   gm_bdry, #
#   #             color="white",
#   #             #label = ~FILE_NAME,
#   #             labelOptions = labelOptions(
#   #               noHide = T, textOnly = T,
#   #               textsize = 22,
#   #               style = list('color' = "white")
#   #             ),
#   #             ##color = ~colorQuantile("gray", gm_la$FILE_NAME)(FILE_NAME),
#   #             fillOpacity = 1,
#   #             group = "background")#%>%
#   
# map3
```

```{r, include=TRUE}
mm2 <- htmltools::browsable(
  #attachDependencies(map,
  htmltools::tagList(map, tbl))
  #htmltools::tagAppendChild(tag1, tbl)
#)

mm2
```


### % Change in offence level Statistics {data-width=100 data-height=100}

```{r, include=TRUE, fig.width=2, fig.height=2}

mm2 <-  htmltools::tagList(tbl)
mm2

```

<!-- ### Deprivation map {data-width=100 data-height=100} -->

<!-- ```{r, include=TRUE, fig.width=2, fig.height=2} -->
<!-- mm3 <- htmltools::browsable( -->
<!--   htmltools::tagList(map) -->
<!-- ) -->
<!-- mm3 -->
<!-- ``` -->

## Row 3 {data-height=100}

### Offence per 1,000 people (LSOA units)

### Offence per 1,000 people (Ward units)

### Offence per 1,000 people (Ward units)


<!-- **References** -->